<!DOCTYPE html>
<html>

<head>
  <title>SearchVidz</title>
  <link rel="stylesheet" href="css/style.css">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.min.css" integrity="sha256-al7Uu0uyKADF89cFejXL3Yu0lobY3xGahFISKqe0C4A="
    crossorigin="anonymous" />

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

  <!-- http://fancyapps.com/fancybox/3/ - JavaScript lightbox library for presenting various types of media. -->
  <!-- versao utilizada no curso -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.min.js" integrity="sha256-rHsXzdTrbQhcO70Gt/DO/9SFvO+AkA/zqy7dCO/iMLU="
    crossorigin="anonymous"></script>

  <script src="js/script.js"></script>
</head>

<body>
  <div id="container">
    <header>
      <h1>Search<span>Vidz</span></h1>
      <p>Search all Youtube videos</p>
    </header>
    <section>
      <form id="search-form" name="search-form" onsubmit="return search()">
        <div class="fieldcontainer">
          <input type="search" id="query" class="search-field" placeholder="Search YouTube...">
          <input type="submit" name="search-btn" id="search-btn" value="">
        </div>
      </form>

      <ul id="results"></ul>
      <div id="buttons"></div>
    </section>
    <footer>
      <p>Copyright &copy; 2018, All Rights Reserved</p>
    </footer>
  </div>
</body>

</html>